import { defineStore } from 'pinia'
import { ref } from 'vue'

export interface AppState {
  // 侧边栏折叠状态
  collapsed: boolean
  // 设备类型
  device: 'desktop' | 'tablet' | 'mobile'
  // 主题
  theme: 'light' | 'dark'
  // 语言
  language: string
  // 页面加载状态
  loading: boolean
  // 标签页显示
  tagsView: boolean
  // 固定头部
  fixedHeader: boolean
  // 侧边栏Logo
  sidebarLogo: boolean
  // 二级菜单弹出
  secondMenuPopup: boolean
  // 显示设置面板
  showSettings: boolean
  // 组件尺寸
  size: string
}

export const useAppStore = defineStore('app', () => {
  // 状态
  const collapsed = ref(false)
  const device = ref<'desktop' | 'tablet' | 'mobile'>('desktop')
  const theme = ref<'light' | 'dark'>('light')
  const language = ref('zh-CN')
  const loading = ref(false)
  const tagsView = ref(true)
  const fixedHeader = ref(false)
  const sidebarLogo = ref(true)
  const secondMenuPopup = ref(false)
  const showSettings = ref(false)
  const size = ref('default')

  // 初始化应用
  const initializeApp = () => {
    // 从本地存储恢复设置
    const savedSettings = localStorage.getItem('admin-settings')
    if (savedSettings) {
      try {
        const settings = JSON.parse(savedSettings)
        tagsView.value = settings.tagsView ?? true
        fixedHeader.value = settings.fixedHeader ?? false
        sidebarLogo.value = settings.sidebarLogo ?? true
        secondMenuPopup.value = settings.secondMenuPopup ?? false
        showSettings.value = settings.showSettings ?? false
        size.value = settings.size ?? 'default'
      } catch (error) {
        console.error('解析设置失败:', error)
      }
    }
  }

  // 切换侧边栏
  const toggleSidebar = () => {
    collapsed.value = !collapsed.value
  }

  // 设置侧边栏状态
  const setSidebarCollapsed = (value: boolean) => {
    collapsed.value = value
  }

  // 设置设备类型
  const setDevice = (deviceType: 'desktop' | 'tablet' | 'mobile') => {
    device.value = deviceType
  }

  // 设置主题
  const setTheme = (themeType: 'light' | 'dark') => {
    theme.value = themeType
  }

  // 设置语言
  const setLanguage = (lang: string) => {
    language.value = lang
  }

  // 设置加载状态
  const setLoading = (status: boolean) => {
    loading.value = status
  }

  // 改变设置
  const changeSetting = (data: { key: string; value: any }) => {
    const { key, value } = data
    switch (key) {
      case 'tagsView':
        tagsView.value = value
        break
      case 'fixedHeader':
        fixedHeader.value = value
        break
      case 'sidebarLogo':
        sidebarLogo.value = value
        break
      case 'secondMenuPopup':
        secondMenuPopup.value = value
        break
      case 'showSettings':
        showSettings.value = value
        break
      case 'size':
        size.value = value
        break
      default:
        break
    }
    
    // 保存到本地存储
    const settings = {
      tagsView: tagsView.value,
      fixedHeader: fixedHeader.value,
      sidebarLogo: sidebarLogo.value,
      secondMenuPopup: secondMenuPopup.value,
      showSettings: showSettings.value,
      size: size.value
    }
    localStorage.setItem('admin-settings', JSON.stringify(settings))
  }

  // 改变组件尺寸
  const changeSize = (newSize: string) => {
    size.value = newSize
    changeSetting({ key: 'size', value: newSize })
  }

  return {
    // 状态
    collapsed,
    device,
    theme,
    language,
    loading,
    tagsView,
    fixedHeader,
    sidebarLogo,
    secondMenuPopup,
    showSettings,
    size,
    // 方法
    initializeApp,
    toggleSidebar,
    setSidebarCollapsed,
    setDevice,
    setTheme,
    setLanguage,
    setLoading,
    changeSetting,
    changeSize
  }
})